<template>
    <div class="school">
        <h2>我是school组件</h2>
        <hr />
        <h4>学校名称:{{name}}</h4>
        <h4>学校名称:{{address}}</h4>
        <h4>news传递给我的信息:{{newsOne}}</h4>
        <button @click="getNewsInfo">点我获取News里的一条新闻</button>
        <button @click="sendInfoToApp">将学校名字发送给App</button>
    </div>
</template>

<script>
    export default {
        name: 'School',
        data() {
            return {
                name:'尚硅谷',
                address:'北京昌平宏福科技园',
                newsOne:''
            }
        },
        methods:{
            getNewsInfo(val){
                this.newsOne = val
            },
            sendInfoToApp(){
                this.$eventBus.$emit('school-name',this.name)
            }
        },
        mounted() {
             this.$eventBus.$on('news',this.getNewsInfo)
        },
        beforeDestroy(){
            this.$eventBus.$off('news')
        }
    }
</script>

<style>
    .school{
        background-color: #cdf;
        padding: 20px;
    }
</style>